<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>庄磊简历</title>
    <meta name="viewport" content="width=device-width" />
    <!-- favicon图标 -->
    <link
      rel="shortcut icon"
      href="../../static/favicon.png"
      type="image/x-icon"
    />
    <!-- 51la网站统计 -->
    <script src="../../static/js/tongji.js"></script>
    <link rel="stylesheet" href="./css/index.css" />

    <link
      href="https://fonts.googleapis.com/css?family=Roboto"
      rel="stylesheet"
    />
    <style type="text/css">
      * {
        /* font-family: 'Roboto'; */
      }
    </style>
  </head>

  <body>
    <!-- ------------ 个人简历 start------------ -->
    <div class="resume" id="app">
      <!-- ------------ 简历头部 start------------ -->
      <header>
        <div class="resume-head">
          <div class="base">
            <div class="base-left">
              <!-- 姓名 -->
              <h1>{{datas.xinxi.user}}</h1>
              <!-- 求职意向 -->
              <div class="qiuzhi">
                {{datas.xinxi.name}}：{{datas.xinxi.text}}
              </div>
              <ul>
                <li
                  v-for="(item, index) in datas.xinxi.data"
                  :key="index"
                  v-show="index<2"
                >
                  {{item.text}}
                </li>
              </ul>
            </div>
            <div class="base-right">
              <img :src="datas.xinxi.img" alt="" />
            </div>
          </div>
        </div>
      </header>

      <!-- ------------ 简历头部  end ------------ -->

      <!-- ------------ 简历主体 start------------ -->
      <div class="resume-main">
        <!-- ------------ 教育背景 start------------ -->
        <div class="module jiaoyu">
          <div class="module-title">{{datas.jiaoyu.title}}</div>
          <div class="module-content">
            <div
              class="module-wrap"
              v-for=" (item, index) in datas.jiaoyu.data"
              :key="index"
            >
              <ul class="col-4">
                <li>{{ item.name }}</li>
                <li>{{ item.type }}</li>
                <li>{{ item.text }}</li>
                <li>{{ item.time }}</li>
              </ul>
            </div>
          </div>
        </div>
        <!-- ------------ 教育背景  end ------------ -->

        <!-- ------------ 工作经验 start------------ -->
        <div class="module gongzuo">
          <div class="module-title">{{datas.gongzuo.title}}</div>
          <div class="module-content">
            <div
              class="module-wrap"
              v-for="(item, index) in datas.gongzuo.data"
              :key="index"
              v-show="index<7"
            >
              <ul class="col-3">
                <li>{{item.name}}</li>
                <li>{{item.type}}</li>
                <li>{{item.time}}</li>
              </ul>
              <div class="item-edit">
                <ul v-for="(item, index) in item.data" :key="index">
                  <li>{{item.text}}</li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <!-- ------------ 工作经验  end ------------ -->

        <!-- ------------ 项目经验 start------------ -->
        <div class="module xiangmu" v-if="datas.xiangmu0">
          <div class="module-title">{{datas.xiangmu.title}}</div>
          <div class="module-content">
            <div
              class="module-wrap"
              v-for="(item, index) in datas.xiangmu.data"
              :key="index"
              v-show="index<1"
            >
              <!-- 左右两行 -->
              <ul class="item-col2">
                <li v-if="item.name">{{item.name}}</li>
                <li v-if="item.text">{{item.text}}</li>
              </ul>
              <div class="item-edit">
                <!-- 项目介绍 -->
                <p v-for="(item, index) in item.jieshao" :key="index">
                  <strong>{{item.name}}：</strong><span>{{item.text}}</span>
                </p>
                <!-- 项目职责 -->
                <div>
                  <strong>{{item.zhize.name}}：</strong>
                  <ul>
                    <li v-for="(item, index) in item.zhize.data" :key="index">
                      {{item.text}}
                    </li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- ------------ 项目经验  end ------------ -->

        <!-- ------------ 专业技能 start------------ -->
        <div class="module jineng" v-if="datas.jineng0">
          <div class="module-title">{{datas.jineng.title}}</div>
          <div class="module-content">
            <div class="module-wrap">
              <div class="item-edit">
                <ul>
                  <li
                    v-for="(item, index) in datas.jineng.data"
                    :key="index"
                    v-show="index < 6 "
                  >
                    {{item.text}}
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <!-- ------------ 专业技能  end  ------------ -->

        <!-- ------------ 培训经历 start ------------ -->
        <div class="module">
          <div class="module-title">{{datas.peixun.title}}</div>
          <div class="module-content">
            <div
              class="module-wrap"
              v-for="(item, index) in datas.peixun.data"
              :key="index"
              v-show="index<4"
            >
              <ul class="col-3">
                <li>{{item.name}}</li>
                <li>{{item.type}}</li>
                <li>{{item.time}}</li>
              </ul>
            </div>
          </div>
        </div>
        <!-- ------------ 培训经历  end  ------------ -->

        <!-- ------------ 荣誉证书 start ------------ -->
        <div class="module zhengshu" v-if="datas.zhengshu">
          <div class="module-title">{{datas.zhengshu.title}}</div>
          <div class="module-content">
            <div class="module-wrap">
              <div class="col-2">
                <ul>
                  <li v-for="(item, index) in datas.ryzs.data" :key="index">
                    <b>{{item.name}}：</b>{{item.text}}
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <!-- ------------ 荣誉证书 end  ------------ -->

        <!-- ------------ 个人评价 start ------------ -->
        <div class="module jineng" v-if="datas.pingjia">
          <div class="module-title">{{datas.pingjia.title}}</div>
          <div class="module-content">
            <div class="module-wrap">
              <div class="item-edit">
                <ul>
                  <li
                    v-for="(item, index) in datas.pingjia.data"
                    :key="index"
                    v-show="index < 6 "
                  >
                    {{item.text}}
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <!-- ------------ 个人评价 end  ------------ -->
      </div>
      <!-- ------------ 简历主体  end  ------------ -->

      <!-- ------------ 底部版权 start------------ -->
      <div class="resume-foot">
        Copyright &copy; 2023 &nbsp;
        <a href="//bealei.com">bealei.com</a>
        &nbsp; 版权所有.
      </div>
      <!-- ------------ 底部版权  end  ------------ -->
    </div>
    <!-- ------------ 个人简历  end  ------------ -->

    <script src="./js/vue.global-3.3.3.min.js"></script>
    <script src="./js/datajson.js"></script>

    <script type="text/javascript">
      const { createApp, ref } = Vue;

      createApp({
        setup() {
          return {
            datas: res.content,
          };
        },
      }).mount("#app");
    </script>
  </body>
</html>
